<template>
    <div style="height:100%;" class="FormBoListEdit2">
        <a-alert v-if="errorMsg" :showIcon="true" type="error" :message="errorMsg"/>
        <a-form v-show="!activeIdx" :form="form" layout="inline" style="height:100%;">
            <a-tabs v-model="activeKey" class="tabBox" @change="tabChange" :size="'small'">
                <a-tab-pane :tab="i18n('list.headerConfig','列头配置')" key="columnConf" :closable="false">
                    <rx-fit style="padding-top: 0px;">
                        <div slot="toolheader" foldbtn="false" border="false">
                            <a-form-item style="display:none">
                                <a-input v-decorator="['id']"/>
                                <a-input v-decorator="['isDialog']"/>
                            </a-form-item>
                            <div class="table-page-search-wrapper">
                                <a-row :gutter="24">
                                    <a-col :span="6">
                                        <a-form-item :label="i18n('form.keyField','主键字段')">
                                            <a-select :size="'small'" v-if="mdl.useCondSql!='WEBREQ'"
                                                      style="width: 100%;" allowClear :options="fieldDatas"
                                                      v-decorator="['idField', {rules: [{required: true, message: i18n('form.keyField','主键字段','select')}]}]"></a-select>
                                            <a-input :size="'small'" v-else style="width: 100%;"
                                                     v-decorator="['idField', {rules: [{required: true, message: i18n('form.keyField','主键字段','select')}]}]"/>
                                        </a-form-item>
                                    </a-col>
                                    <a-col :span="6">
                                        <a-form-item :label-col="labelCol" :wrapper-col="wrapperCol"
                                                     :label="i18n('form.publishField','发布字段')">
                                            <a-select mode="tags" style="width: 100%;"
                                                      :size="'small'"
                                                      allowClear
                                                      v-if="mdl.useCondSql!='WEBREQ'"
                                                      label-in-value
                                                      :options="fieldDatas"
                                                      v-decorator="['publishConf']">
                                            </a-select>
                                            <a-input v-else style="width: 100%;" :size="'small'"
                                                     v-decorator="['publishConf']"/>
                                        </a-form-item>
                                    </a-col>
                                    <a-col :span="6">
                                        <a-form-item :label-col="labelCol" :wrapper-col="wrapperCol"
                                                     :label="i18n('form.textPosition','全局文本位置')">
                                            <a-radio-group :placeholder="i18n('form.textPosition','全局文本位置')"
                                                           v-decorator="['fontPosition']" @change="positionChange">
                                                <a-radio value="left">{{ i18n('form.left', '居左') }}</a-radio>
                                                <a-radio value="center">{{ i18n('form.center', '居中') }}</a-radio>
                                                <a-radio value="right">{{ i18n('form.right', '居右') }}</a-radio>
                                            </a-radio-group>
                                        </a-form-item>
                                    </a-col>
                                    <a-col :span="6">
                                        <div style="line-height: 40px;">
                                            <span>{{ i18n('form.displayOrNot', '显示字段显隐') }}：</span>
                                            <a-switch v-model="isFieldShow" size="small"/>
                                        </div>
                                    </a-col>
                                </a-row>
                                    <a-row :gutter="24">
                                    <a-col :span="6" v-for="(record,key,index) in listLayout">
                                        <div style="line-height: 40px;">
                                            <!--       是否开启看板视图  or                                    -->
                                            <span>{{
                                                    i18n('enableOrNot', '是否开启') + " " + i18n('form.kanbanView', record.name) + '：'
                                                }}</span>
                                            <a-switch v-model="record.status" size="small"/>
                                            <my-icon @click="editListLayoutConfig(key)" style="margin-left: 5px"
                                                     type="iconsetup"></my-icon>
                                            <a-tag v-if="record.config" style="margin-left: 10px" color="green">
                                                {{ i18n('set', '已设置') }}
                                            </a-tag>
                                            <a-tag v-else style="margin-left: 10px" color="red">
                                                {{ i18n('notSet', '未设置') }}
                                            </a-tag>
                                        </div>
                                    </a-col>
                                    <a-col :span="6" v-show="mdl.dataStyle=='tree'">
                                        <a-form-item :label-col="labelCol" :wrapper-col="wrapperCol"
                                                     :label="i18n('list.treeField','树节点字段')">
                                            <div style="display: flex;width: 100%;align-items: center">
                                                <a-tooltip>
                                                <span slot="title">
                                                  <div><span style="color: red">{{i18n('form.keyField','主键字段')}}</span>:
                                                    {{i18n('idFieldTip','树的主键字段，一般情况下选择主键字段，或者其它唯一字段')}}</div>
                                                  <div><span style="color: red">{{i18n('list.treeField','树节点字段')}}</span>:
                                                    {{i18n('treeFieldTip','显示树节点字段，一般选择有上下层级，显示上易于理解的字段，如 集团-分公司-部门')}}</div>
                                                  <div><span style="color: red">{{i18n('form.parentField','父ID字段')}}</span>:
                                                    {{i18n('parentFieldTip','一般选择父ID')}}</div>
                                                  <div><span style="color: red">{{i18n('form.parentIdValue','第一级父ID值')}}</span>:
                                                    {{i18n('parentIdValueTip','第一级父ID值即根节点ID值，本产品树列表根节点ID值默认为0，支持自定义根节点ID值')}}</div>
                                                </span>
                                                    <a-icon type="question-circle-o" style="vertical-align:middle;"/>
                                                </a-tooltip>
                                                <div style="margin-left: 10px;flex: 1">
                                                    <a-select :size="'small'" v-if="mdl.useCondSql!='WEBREQ'"
                                                              style="width: 100%;" allowClear :options="fieldDatas"
                                                              v-decorator="['textField', {rules: [{required: mdl.dataStyle=='tree', message: this.i18n('list.treeField','树节点字段','select')}]}]"></a-select>
                                                    <a-input v-else style="width: 100%"
                                                             v-decorator="['textField', {rules: [{required: mdl.dataStyle=='tree', message: this.i18n('list.treeField','树节点字段','select')}]}]"/>
                                                </div>
                                            </div>
                                        </a-form-item>
                                    </a-col>
                                    <a-col :span="6" v-show="mdl.dataStyle=='tree'">
                                        <a-form-item :label-col="labelCol" :wrapper-col="wrapperCol"
                                                     :label="i18n('form.parentField','父ID字段')">
                                            <a-select :size="'small'" v-if="mdl.useCondSql!='WEBREQ'"
                                                      style="width: 100%;" allowClear :options="fieldDatas"
                                                      v-decorator="['parentField', {rules: [{required: mdl.dataStyle=='tree', message: this.i18n('form.parentField','父ID字段')}]}]"></a-select>
                                            <a-input v-else style="width: 90px;"
                                                     v-decorator="['parentField', {rules: [{required: mdl.dataStyle=='tree', message: this.i18n('form.parentField','父ID字段')}]}]"/>
                                        </a-form-item>
                                    </a-col>
                                    <a-col :span="6" v-show="mdl.dataStyle=='tree'">
                                        <a-form-item :label="i18n('form.parentIdValue','第一级父ID值')">
                                            <a-input style="width: 90px;" v-decorator="['parentIdValue']"/>
                                        </a-form-item>
                                    </a-col>
                                </a-row>
                            </div>
                            <div class="table-operator">
                                <a-button :size="'small'" @click="reloadColumns">
                                    {{ i18n('list.reloadTable', '重新加载表头') }}
                                </a-button>
                                <a-button :size="'small'" @click="addColumnRow">{{ i18n('list.newLine', '新增行') }}
                                </a-button>
                                <a-button :size="'small'" @click="removeRow">{{ i18n('list.deleteLine', '删除行') }}
                                </a-button>
                                <a-button :size="'small'" @click="upRow">{{ i18n('list.upward', '向上') }}</a-button>
                                <a-button :size="'small'" @click="downRow">{{ i18n('list.down', '向下') }}</a-button>
                                <a-button :size="'small'" @click="topUp">{{ i18n('list.topUp', '置顶') }}</a-button>
                                <a-button :size="'small'" @click="bottomUp">{{ i18n('list.bottomUp', '置底') }}</a-button>
                                <a-button :size="'small'" @click="mainHeaderRow">{{ i18n('list.moveUp', '上升一级') }}
                                </a-button>
                                <a-button :size="'small'" @click="subHeaderRow">{{ i18n('list.downOne', '下降一级') }}
                                </a-button>
                                <a-button :size="'small'" @click="expand">{{ $ti18('rxList.openBtn', '展开') }}</a-button>
                                <a-button :size="'small'" @click="collapse">{{ $ti18('rxList.putAwayBtn', '收起') }}
                                </a-button>
                                <a-button :size="'small'" v-if="mdl.rowEdit=='YES'" @click="rowControlConfig">
                                    {{ i18n('list.editConfig', '编辑控件配置') }}
                                </a-button>
                                <a-button :size="'small'" @click="cellHeaderConfig">
                                    {{ i18n('list.colRender', '列头渲染') }}
                                </a-button>
                                <a-button v-if="headerFields.length>0" :size="'small'" @click="oneKFilterConf">{{i18n('list.oneKFilterConf','一键过滤配置')}}</a-button>
                            </div>
                        </div>
                        <rx-grid ref="table_columnConf"
                                 :dataSource="headerFields"
                                 :allowRowSelect="true"
                                 :multiSelect="true"
                                 :showPage="false"
                                 :bordered="true"
                                 :columns="headerColumns"
                        >
                            <span slot="customTitle">{{ i18n('form.width', '宽度') }}
                                <a-tooltip>
                                    <span slot="title">{{ i18n('attention', '注意') }}：<span
                                        style="color: red">{{
                                            i18n('fixColumn', '有固定列')
                                        }}</span>{{ i18n('clearWidth', '的时候,需要清空一个或几个列的宽度，不要所有列都有宽度') }}</span>
                                    <a-icon type="question-circle-o"/>
                                </a-tooltip>
                            </span>
                            <span slot="customRowMergeTitle">{{ i18n('form.rowMerge', '行合并') }}
                                <a-tooltip>
                                    <span slot="title">
                                        勾选后，对所有连续行中当列字段值相同的行进行合并。
                                    </span>
                                    <a-icon type="question-circle-o"/>
                                </a-tooltip>
                            </span>
                            <span slot="header" slot-scope="{text,record,index}">
                                <a-input style="width:100%" v-model="record.header" @change="updateI18nName(record,'header')">
                                    <my-icon slot="addonAfter" type="iconearth-full" @click="editI18nName(record,'header')"/>
                                </a-input>
                            </span>
                            <div class="rx-table-field-col" slot="field" slot-scope="{text,record,index}">
                                <a-select
                                    show-search
                                    v-if="mdl.useCondSql!=='WEBREQ' && record.renderType!=='ACTION' "
                                    v-model="record.field"
                                    option-filter-prop="children" :filter-option="filterOption"
                                    @focus="fieldFocus(record)"
                                    :dropdown-menu-style="{width:'250px'}"
                                    :dropdownMatchSelectWidth="false"
                                    @change="changeFieldName($event,record,'header')"
                                    :options="headFields"/>
                                <a-input v-model="record.field" v-else/>
                            </div>
                            <div slot="rowMerge" slot-scope="{text,record,index}">
                                <a-checkbox :checked="record.rowMerge" @change="rowMergeChange($event,record)"/>
                            </div>
                            <span slot="width" slot-scope="{text,record,index}">
                                <a-input-number v-model="record.width" :min="5" :max="1200"/>
                            </span>
                            <span slot="dataType" slot-scope="{text,record,index}">
                                <a-select v-model="record.dataType" :dropdownMatchSelectWidth="true" v-if="record.renderType!='ACTION'">
                                    <a-select-option value="string">{{ i18n('character', '字符') }}</a-select-option>
                                    <a-select-option value="int">{{ i18n('integer', '整型') }}</a-select-option>
                                    <a-select-option value="number">{{ i18n('float', '浮点型') }}</a-select-option>
                                    <a-select-option value="date">{{ i18n('dateType', '日期型') }}</a-select-option>
                                    <a-select-option value="boolean">{{ i18n('boolean', '布尔型') }}</a-select-option>
                                    <a-select-option value="currency">{{ i18n('moneyType', '货币型') }}</a-select-option>
                                </a-select>
                            </span>
                            <span slot="format" slot-scope="{text,record,index}">
                              <a-input v-model="record.format"/>
                            </span>
                            <span slot="control" slot-scope="{text,record,index}">
                                <a-select v-if="!standardFields.contains(record.field)" popupClassName="tableSelect" v-model="record.control"
                                        :options="rowControls"></a-select>
                            </span>
                            <span slot="headerAlign" slot-scope="{text,record,index}">
                               <a-select v-model="record.headerAlign">
                                <a-select-option value="center">{{ i18n('form.center', '居中') }}</a-select-option>
                                <a-select-option value="left">{{ i18n('form.left', '居左') }}</a-select-option>
                                <a-select-option value="right">{{ i18n('form.right', '居右') }}</a-select-option>
                              </a-select>
                            </span>
                            <span slot="fixed" slot-scope="{text,record,index}">
                              <a-select v-model="record.fixed">
                                <a-select-option value="false">&nbsp;</a-select-option>
                                <a-select-option value="left">{{ i18n('fixedLeft', '固定左') }}</a-select-option>
                                <a-select-option value="right">{{ i18n('fixedRight', '固定右') }}</a-select-option>
                              </a-select>
                            </span>
                            <span slot="renderType" slot-scope="{text,record,index}">
                                <a-select popupClassName="tableSelect"
                                        allowClear
                                        v-model="record.renderType"
                                        @change="renderTypeChange($event,record)"
                                        :options="cololumRenderTypes"
                                        :dropdown-menu-style="{width:'200px'}"
                                        :dropdownMatchSelectWidth="false"
                                ></a-select>
                            </span>
                            <span slot="renderField" slot-scope="{text,record,index}">
                                <a-button
                                   :icon="record.renderConf?'check-circle':''"
                                  :class="{'button-set':record.renderConf}"
                                  @click.stop="cellRenderConfig($event,record)" type="button"
                                        v-if="record.isShowNotRender==false||record.renderType=='IMG'">
                                  {{i18n('render', '渲染') }}
                                </a-button>
                                <my-icon v-if="record.renderConf" type="iconVue3_delete"style="margin-left: 5px; color: red;" @click="clearRenderSetting(record,'render')"/>
                                <a-button
                                    style="margin-left: 15px;"
                                    :icon="record.linkConf?'check-circle':''"
                                    :class="{'button-set':record.linkConf}"
                                    type="button"
                                    @click="linkSetting(record)"
                                    v-if="showLinkConfig(record)">
                                    {{ i18n('link', '链接') }}
                                </a-button>
                                <my-icon v-if="showLinkConfig(record) && record.linkConf" type="iconVue3_delete"style="margin-left: 5px; color: red;" @click="clearRenderSetting(record,'link')"/>
                            </span>
                            <span slot="filterConfig" slot-scope="{text,record,index}">
                              <a-button
                                  :class="{'button-set':record.isSeted}"
                                  :icon="record.isSeted?'check-circle':''"
                                  @click="showFilterConfigEditor($event,record)"
                              >{{i18n('list.config','配置')}}</a-button>
                                 <my-icon v-if="record.isSeted" type="iconVue3_delete"style="margin-left: 5px; color: red;" @click="clearFilterConfig(record)"/>
                            </span>
                        </rx-grid>
                    </rx-fit>
                </a-tab-pane>
                <a-tab-pane forceRender v-if="isExpandRow=='YES'" :tab="i18n('list.rowConfig','展示行配置')"
                            key="expandRowConf" :closable="false">
                    <form-bo-list-expand-row ref="expandRow"></form-bo-list-expand-row>
                </a-tab-pane>
                <a-tab-pane forceRender v-if="isLeftTree=='YES'" :tab="i18n('list.treeConfig','导航树配置')"
                            key="tabTreeConf" :closable="false">
                    <rx-fit style="padding-top: 10px;">
                        <div slot="toolheader" foldbtn="false" border="false">
                            <div class="table-operator">
                                <a-button @click="addLeftTreeRow">{{ i18n('list.add', '新增') }}</a-button>
                                <a-button @click="removeRow">{{ $ti18('rxList.delBtn', '删除') }}</a-button>
                            </div>
                        </div>
                        <rx-grid ref="table_tabTreeConf"
                                 :dataSource="leftTreeFields"
                                 :columns="leftTreeColumns"
                                 :allowRowSelect="true"
                                 :multiSelect="true"
                                 :showPage="false"
                                 :enableHtmlEscape="false"
                                 :bordered="true"
                                 style="height:90%;">
                            <span slot="tabName" slot-scope="{text,record,index}">
                                <a-input-group class="tabNavNameGroup" compact style="width:100%">
                                  <a-input class="tabNavNameInput" v-model="record.tabName_name" :disabled="true"/>
                                  <a-button class="tabNavNameButton"
                                            @click="openTabTree(text,record)">·&nbsp;·&nbsp;·</a-button>
                                </a-input-group>
                            </span>
                            <span slot="treeId" slot-scope="{text,record,index}">
                              <a-input v-model="record.treeId"/>
                            </span>
                            <span slot="onnodeclick" slot-scope="{text,record,index}">
                              <a-input v-model="record.onnodeclick"/>
                            </span>
                            <span slot="paramName" slot-scope="{text,record,index}">
                              <a-select v-model="record.paramName" :options="paramData"></a-select>
                            </span>
                            <span slot="onlySelLeaf" slot-scope="{text,record,index}">
                                <a-radio-group v-model="record.onlySelLeaf">
                                    <a-radio value="YES">{{ i18n('yes', '是') }}</a-radio>
                                    <a-radio value="NO">{{ i18n('no', '否') }}</a-radio>
                                </a-radio-group>
                            </span>
                        </rx-grid>
                    </rx-fit>
                </a-tab-pane>
                <a-tab-pane forceRender v-if="showSummaryRow==='YES' && !['WEBREQ','INTERFACE'].includes(mdl.useCondSql)"
                            :tab="i18n('list.staticConfig','统计行配置')" key="summaryConf" :closable="false">
                    <CalcRow v-model="statisticsRows" :isSeqCol="mdl.hasSeq" :isMultiSelect="mdl.multiSelect" :isSelectCol="mdl.hasSelect" :fieldOptions="fieldDatas" :isOldCalcData="isOldCalcData"></CalcRow>
                </a-tab-pane>
                <a-tab-pane forceRender :tab="i18n('list.searchConfig','搜索条件配置')" key="searchConf" :closable="false">
                    <rx-fit style="padding-top: 6px;">
                        <div slot="toolheader" foldbtn="false" border="false">
                            <div class="list-design-search-header">
                                <a-form-item :label="i18n('list.enableSearch','是否开启搜索条件')">
                                    <a-switch v-model="isShowSearch" size="small"/>
                                </a-form-item>
                                <template v-if="isShowSearch">
                                    <a-form-item :label="i18n('list.searchStyle','搜索条件风格')">
                                        <a-radio-group v-model="showSearchStyle">
                                            <a-radio value="NO">{{ i18n('defPack', '默认收起') }}</a-radio>
                                            <a-radio value="YES">{{ i18n('topList', '放列表顶部') }}</a-radio>
                                        </a-radio-group>

                                    </a-form-item>
                                    <template v-if="showSearchStyle=='YES'">
                                        <a-form-item :label="i18n('foldedConditions', '收起显示条件数')">
                                            <a-input-number style="width: 60px!important;" v-model="searchMax" :min="2" :max="10"/>
                                        </a-form-item>
                                    </template>
                                    <a-form-item :label="i18n('list.searchLayout','搜索条件布局')">
                                        <a-radio-group :placeholder="i18n('list.searchLayout','搜索条件布局')"
                                                       v-model="showSearchLayout">
                                            <a-radio value="YES">{{ i18n('vertical', '垂直') }}</a-radio>
                                            <a-radio value="NO">{{ i18n('Horizontal', '水平') }}</a-radio>
                                        </a-radio-group>
                                    </a-form-item>
                                </template>
                            </div>
                            <div class="table-operator">
                                <a-button size="small" @click="addSearchRow">{{ i18n('list.addConfig', '新增条件配置') }}
                                </a-button>
                                <a-button size="small" @click="removeRow">{{ i18n('list.deleteConfig', '删除条件配置') }}
                                </a-button>
                                <a-button size="small" @click="upRow">{{ i18n('list.upward', '向上') }}</a-button>
                                <a-button size="small" @click="downRow">{{ i18n('list.down', '向下') }}</a-button>
                            </div>
                        </div>
                        <rx-grid ref="table_searchConf"
                                 :dataSource="searchFields"
                                 :columns="searchColumns"
                                 :allowRowSelect="true"
                                 :multiSelect="true"
                                 :showPage="false"
                                 :bordered="true"
                        >
                            <span slot="type" slot-scope="{text,record,index}">
                              <a-select v-model="record.type">
                                <a-select-option value="query">{{ i18n('list.queryPara', '查询参数') }}</a-select-option>
                                <a-select-option value="income">{{ i18n('list.incomPara', '传入参数') }}</a-select-option>
                              </a-select>
                            </span>
                            <span slot="tablePre" slot-scope="{text,record,index}">
                              <a-input v-model="record.tablePre"/>
                            </span>
                            <span slot="fieldName" slot-scope="{text,record,index}">
                                <span style="color: red;margin-right: 2px">*</span>
                                <template v-if="mdl.useCondSql!='WEBREQ'">
                                    <a-input v-model="record.fieldName" style="width:calc( 100% -  25px  ) "></a-input>
                                    <rx-popover :comboBox="{'width':'200px'}">
                                        <span slot="title"><a-icon type="search" style="margin-left: 4px"/></span>
                                        <div slot="content" slot-scope="{ close }">
                                            <a-select
                                                style="width: 100%;"
                                                :options="fieldDatas"
                                                @select="selectGroupNodeFun($event,record,'fieldLabel',close)"
                                                :getPopupContainer="p=>p.parentNode"
                                                :dropdown-menu-style="{width:'300px'}"
                                                :dropdownMatchSelectWidth="false"
                                            >
                                            </a-select>
                                        </div>
                                    </rx-popover>
                                </template>
                                <a-input v-model="record.fieldName" v-else/>
                            </span>
                            <span slot="fieldLabel" slot-scope="{text,record,index}">
                              <a-input v-model="record.fieldLabel" @change="updateI18nName(record,'fieldLabel')">
                                    <my-icon slot="addonAfter" type="iconearth-full"
                                             @click="editI18nName(record,'fieldLabel')"/>
                                </a-input>
                            </span>
                            <span slot="autoFilter" slot-scope="{text,record,index}">
                              <a-select v-model="record.autoFilter">
                                <a-select-option value="YES">{{ i18n('yes', '是') }}</a-select-option>
                                <a-select-option value="NO">{{ i18n('no', '否') }}</a-select-option>
                              </a-select>
                            </span>
                            <span slot="defaultVal" slot-scope="{text,record,index}">
                                <a-input v-model.trim="record.defaultVal"/>
                            </span>
                            <span slot="fieldOp" slot-scope="{text,record,index}">
                                <div v-if="record.fc!='numberrange'">
                                    <a-select
                                        v-if="record.fc=='month'"
                                        v-model="record.fieldOp">
                                      <a-select-option value="EQ">{{ i18n('equal', '等于') }}</a-select-option>
                                      <a-select-option value="NEQ">{{ i18n('notEqual', '不等于') }}</a-select-option>
                                      <a-select-option value="LT">{{ i18n('lessThan', '小于') }}</a-select-option>
                                      <a-select-option value="LE">{{ i18n('lessOrEqual', '小于等于') }}</a-select-option>
                                      <a-select-option value="GT">{{ i18n('greater', '大于') }}</a-select-option>
                                      <a-select-option value="GE">{{ i18n('greatOrEqual', '大于等于') }}</a-select-option>
                                    </a-select>
                                <a-select
                                    v-else-if="(record.dataType==null || record.dataType=='string'   || record.dataType=='varchar' || record.dataType=='clob') &&  record.fc!='month'"
                                    v-model="record.fieldOp">
                                      <a-select-option value="EQ">{{ i18n('equal', '等于') }}</a-select-option>
                                      <a-select-option value="NEQ">{{ i18n('notEqual', '不等于') }}</a-select-option>
                                      <a-select-option value="IN">{{ i18n('include', '包含') }}</a-select-option>
                                      <a-select-option value="MLK"
                                                       v-if="['select','treeselect','dialog','user','group','checkboxgroup'].includes(record.fc)">{{
                                              i18n('multipleFuzzyMatch', '多选模糊查询')
                                          }}</a-select-option>
                                      <a-select-option value="LK">{{ i18n('fuzzyMatch', '模糊匹配') }}</a-select-option>
                                      <a-select-option value="LEK">{{ i18n('leftQuery', '左模糊查询') }}</a-select-option>
                                      <a-select-option value="RIK">{{ i18n('rightQuery', '右模糊查询') }}</a-select-option>
                                    </a-select>
                                  <a-select
                                      v-else-if="['int','number'].includes(record.dataType) && record.fc!='rangepicker'"
                                      v-model="record.fieldOp">
                                      <a-select-option value="EQ">{{ i18n('equal', '等于') }}</a-select-option>
                                      <a-select-option value="NEQ">{{ i18n('notEqual', '不等于') }}</a-select-option>
                                      <a-select-option value="IN">{{ i18n('include', '包含') }}</a-select-option>
                                      <a-select-option value="MLK"
                                                       v-if="['select','treeselect','dialog','user','group','checkboxgroup'].includes(record.fc)">{{
                                              i18n('multipleFuzzyMatch', '多选模糊查询')
                                          }}</a-select-option>
                                      <a-select-option value="LT">{{ i18n('lessThan', '小于') }}</a-select-option>
                                      <a-select-option value="LE">{{ i18n('lessOrEqual', '小于等于') }}</a-select-option>
                                      <a-select-option value="GT">{{ i18n('greater', '大于') }}</a-select-option>
                                      <a-select-option value="GE">{{ i18n('greatOrEqual', '大于等于') }}</a-select-option>
                                    </a-select>
                                 <a-select v-else-if="(record.dataType=='date' && record.fc!='rangepicker')"
                                           v-model="record.fieldOp">
                                      <a-select-option value="EQ">{{ i18n('equal', '等于') }}</a-select-option>
                                      <a-select-option value="NEQ">{{ i18n('notEqual', '不等于') }}</a-select-option>
                                      <a-select-option value="LT">{{ i18n('lessThan', '小于') }}</a-select-option>
                                      <a-select-option value="LE">{{ i18n('lessOrEqual', '小于等于') }}</a-select-option>
                                      <a-select-option value="GT">{{ i18n('greater', '大于') }}</a-select-option>
                                      <a-select-option value="GE">{{ i18n('greatOrEqual', '大于等于') }}</a-select-option>
                                    </a-select>
                                </div>
                            </span>
                            <span slot="fc" slot-scope="{text,record,index}">
                              <a-select v-model="record.fc"
                                        :options="fieldControls" @change="fcChange($event,record)"></a-select>
                            </span>
                            <span slot="searchSetting" slot-scope="{text,record,index}">
                              <a-button
                                  @click="showSearchConfigEditor($event,record)">{{
                                      i18n('list.config', '配置')
                                  }}</a-button>
                              <my-icon v-if="record.isSeted" @click="fcCleanUp(record)" type="iconVue3_delete" style="margin-left: 5px; color: red;"/>
                              <span v-if="record.isSeted" class="is-seted">
                                  <i class="iconfont iconsuccess_fill is-seted"></i>{{ i18n('configured', '已配') }}</span>
                            </span>
                        </rx-grid>
                    </rx-fit>
                </a-tab-pane>
                <a-tab-pane forceRender :tab="i18n('list.queryConfig','查询视图配置')" key="editSearchView" :closable="false">
                    <form-bo-list-edit-search-view ref="editSearchView" :boListId="pkId" :curAppObj="curAppObj"
                                                   :fieldDataAll="fieldDatas"></form-bo-list-edit-search-view>
                </a-tab-pane>
                <a-tab-pane forceRender :tab="i18n('list.dataPermiss','数据权限')" key="dataConf" :closable="false">
                  <form-bo-list-edit-data-conf ref="table_dataConf" :fieldDatas="fieldDatas" :boListId="pkId"/>
                </a-tab-pane>
                <a-tab-pane forceRender :tab="i18n('list.funcButton','功能按钮')" key="toolBar" :closable="false">
                    <rx-fit style="padding-top: 8px;">
                        <div slot="toolheader" foldbtn="false" border="false">
                            <div class="table-operator">
                                <a-button size="small" @click="addButtonRow">{{ i18n('list.add', '新增') }}</a-button>
                                <a-button size="small" v-if="mdl.isDialog=='NO'" @click="addToolbarAllRows">
                                    {{ i18n('list.newDefault', '新增默认') }}
                                </a-button>
                                <a-button size="small" @click="removeRow">{{ $ti18('rxList.delBtn', '删除') }}</a-button>
                                <a-button size="small" @click="upRow">{{ i18n('list.upward', '向上') }}</a-button>
                                <a-button size="small" @click="downRow">{{ i18n('list.down', '向下') }}</a-button>
                                <a-button :size="'small'" @click="topUp">{{ i18n('list.topUp', '置顶') }}</a-button>
                                <a-button :size="'small'" @click="bottomUp">{{ i18n('list.bottomUp', '置底') }}</a-button>
                                <a-button size="small" @click="mainHeaderRow">{{ i18n('list.moveUp', '上升一级') }}
                                </a-button>
                                <a-button size="small" @click="subHeaderRow">{{ i18n('list.downOne', '下降一级') }}
                                </a-button>

                            </div>
                            <div class="table-page-search-wrapper">
                                <a-row :gutter="24">
                                    <a-col :span="6">
                                        <a-form-item :label="i18n('list.maxButton','最大按钮显示数')">
                                            <a-input-number style="width: 200px;" v-model="buttonMax" size="small" :min="1" :max="10" @change="btnChangeNum"/>
                                        </a-form-item>
                                    </a-col>
                                </a-row>
                            </div>
                        </div>
                        <rx-grid
                            class="table_toolBar"
                            ref="table_toolBar"
                            :dataSource="toolBarFields"
                            :columns="toolBarColumns"
                            :allowRowSelect="true"
                            :allowMoveColumn="true"
                            :multiSelect="true"
                            :showPage="false"
                            :bordered="true"
                            id-field="toolId"
                            parent-field="toolPid"
                        >
                            <span slot="btnLabel" slot-scope="{text,record,index}">
                              <a-input style="width:150px" v-model="record.btnLabel"
                                       @change="updateI18nName(record,'btnLabel')">
                                    <my-icon slot="addonAfter" type="iconearth-full"
                                             @click="editI18nName(record,'btnLabel')"/>
                                </a-input>
                            </span>
                            <span slot="btnName" slot-scope="{text,record,index}">
                              <a-input v-model="record.btnName"/>
                            </span>
                            <span slot="btnStyle" slot-scope="{text, record, index}">
                                <a-select v-model="record.btnStyle"
                                          :options="buttonStyle"></a-select>
                            </span>

                            <span slot="btnType" slot-scope="{text, record, index}">
                                <a-select v-model="record.btnType"
                                          @change="changePcBtnType(record)" :options="buttonType"></a-select>
                            </span>
                            <span slot="btnClick" slot-scope="{text,record,index}">
                                <div v-if="record.preDef">
                                    {{ record.btnClick }}
                                </div>
                                <a-input v-else v-model="record.btnClick"/>
                            </span>
                            <span slot="btnIcon" slot-scope="{text,record,index}">
                                <rx-input-icon v-model="record.btnIcon"
                                               @change="iconChange($event,record)"></rx-input-icon>
                            </span>
                            <span slot="config" slot-scope="{text,record,index}">
                                <a-button v-show="record.needConfig" size="small"
                                          @click="configButton(record)">{{ i18n('list.config', '配置') }}</a-button>
                                <span v-if="record.isSetedBtn" class="is-seted"><i
                                    class="iconfont iconsuccess_fill is-seted"></i>{{ i18n('configured', '已配') }}</span>
                                <a-icon v-if="record.isSetedBtn" type="delete" style="margin-left: 10px;"
                                        @click="clearBtnConfig(record)"/>

                            </span>
                            <span slot="btnShow" slot-scope="{text,record,index}">
                                <!-- <span style="margin-right: 10px" :style="'color:'+(record.btnShow?'green':'red')">{{record.btnShow?'已配置':'未配置'}}</span> -->
                                <a-button size="small"
                                          @click="openShowSetting(record)">{{ i18n('list.config', '配置') }}</a-button>
                                <span v-if="record.isSetedShowCondition" class="is-seted"><i
                                    class="iconfont iconsuccess_fill is-seted"></i>{{ i18n('configured', '已配') }}</span>
                                <a-icon v-if="record.isSetedShowCondition" type="delete" style="margin-left: 10px;"
                                        @click="clearBtnShowCondition(record)"/>
                            </span>
                            <span slot="btnPreCond" slot-scope="{text,record,index}">
                                <a-button size="small"
                                          @click="openPreCondSetting(record)">{{ i18n('list.config', '配置') }}</a-button>
                                <span v-if="record.isSetedPreCondition" class="is-seted"><i
                                    class="iconfont iconsuccess_fill is-seted"></i>{{ i18n('configured', '已配') }}</span>
                                <a-icon v-if="record.isSetedPreCondition" type="delete" style="margin-left: 10px;"
                                        @click="clearPreCondition(record)"/>
                            </span>
                        </rx-grid>
                    </rx-fit>
                </a-tab-pane>
                <!--返回字段列-->
                <a-tab-pane v-if="mdl.isDialog=='YES'" forceRender :tab="i18n('list.returnCol','返回字段列')"
                            key="returnColumn" :closable="false">
                    <rx-fit style="padding-top: 10px;">
                        <div class="returnFieldBtn">
                            <div class="tableToolBar">
                                <a-button type="primary" @click="selectReturnColumn('query')">
                                    {{ i18nCustomQuery('isButton.columnHeader', '列头设置') }}
                                </a-button>
                                <a-button type="danger" @click="removeReturnFields('query')">
                                    {{ $ti18('rxList.delBtn', '删除') }}
                                </a-button>
                                <a-button type="primary" @click="moveUpReturn('query')">
                                    {{ $comi18('grid.up', '向上') }}
                                </a-button>
                                <a-button type="primary" @click="moveDownReturn('query')">
                                    {{ $comi18('grid.down', '向下') }}
                                </a-button>
                                <a-button type="primary" @click="topUp">{{ i18n('list.topUp', '置顶') }}</a-button>
                                <a-button type="primary" @click="bottomUp">{{ i18n('list.bottomUp', '置底') }}</a-button>
                            </div>
                        </div>

                        <rx-grid ref="table_returnColumn"
                                 :dataSource="returnFields"
                                 :columns="returnColumns"
                                 :allowRowSelect="true"
                                 :multiSelect="true"
                                 :showPage="false"
                                 :bordered="true"
                                 style="height:90%;">
                            <span slot="header" slot-scope="{text,record,index}">
                              <span>
                                <a-input style="width:100%" v-model="record.header"
                                         @change="updateI18nName(record,'header')">
                                    <my-icon slot="addonAfter" type="iconearth-full"
                                             @click="editI18nName(record,'header')"/>
                                </a-input>
                              </span>
                            </span>
                            <span slot="displayField" slot-scope="{text,record,index}">
                                <a-checkbox v-model="record.displayField" @change="selectDisplay(record)"/>
                            </span>
                        </rx-grid>
                    </rx-fit>
                </a-tab-pane>

                <!--数据映射(第三方接口)-->
                <a-tab-pane v-if="mdl.useCondSql=='INTERFACE' && interfaceFields.length>0" forceRender
                            :tab="i18n('list.dataMap','数据映射')"
                            key="dataSet" :closable="false">
                    <a-tabs v-model="interfaceActiveKey">
                        <a-tab-pane :tab="params.title" :key="params.key" v-for="params in interfaceFields">
                            <rx-grid :ref="params.key"
                                     :showPage="false"
                                     :columns="webColumns"
                                     :dataSource="params.fields"
                                     :bordered="true"
                                     style="height:90%;"
                            >
                                <span slot="valueSource" slot-scope="{text,record,index}">
                                    <a-select v-model="record.valueSource" v-if="!record.children">
                                      <a-select-option value="param">{{ i18n('paraPass', '参数传入') }}</a-select-option>
                                      <a-select-option value="fixedVar">{{ i18n('fixValue', '固定值') }}</a-select-option>
                                      <a-select-option value="script">{{ i18n('form.script', '脚本') }}</a-select-option>
                                      <a-select-option
                                          value="constantVar">{{ i18n('constant', '常量') }}</a-select-option>
                                    </a-select>
                                </span>
                                <span slot="value" slot-scope="{text,record,index}">
                                   <a-input v-if="record.valueSource=='fixedVar'" v-model="record.value"/>
                                    <a-input-group v-if="record.valueSource=='script'" compact>
                                      <a-input v-model="record.value" style="width:80%;"/>
                                      <a-button @click="openScriptQuery(text,record)">...</a-button>
                                    </a-input-group>
                                    <a-select v-if="record.valueSource=='constantVar'" v-model="record.value"
                                              :options="constantField"></a-select>
                                </span>
                            </rx-grid>
                        </a-tab-pane>
                    </a-tabs>
                </a-tab-pane>
                <!--数据映射(webreq)-->
                <a-tab-pane v-if="mdl.useCondSql=='WEBREQ'" forceRender :tab="i18n('list.dataMap','数据映射')" key="dataSet"
                            :closable="false">
                    <a-tabs v-model="webActiveKey">
                        <a-tab-pane :tab="i18n('list.requestConfig','请求头配置')" key="header">
                            <rx-grid ref="header"
                                     :showPage="false"
                                     :columns="webColumns"
                                     :dataSource="webHeaderFields"
                                     :bordered="true"
                                     style="height:90%;"
                            >
                                <span slot="valueSource" slot-scope="{text,record,index}">
                                    <a-select v-model="record.valueSource">
                                      <a-select-option value="param">{{ i18n('paraPass', '参数传入') }}</a-select-option>
                                      <a-select-option value="fixedVar">{{ i18n('fixValue', '固定值') }}</a-select-option>
                                      <a-select-option value="script">{{ i18n('form.script', '脚本') }}</a-select-option>
                                      <a-select-option
                                          value="constantVar">{{ i18n('constant', '常量') }}</a-select-option>
                                    </a-select>
                                </span>
                                <span slot="value" slot-scope="{text,record,index}">
                                   <a-input v-if="record.valueSource=='fixedVar'" v-model="record.value"/>
                                    <a-input-group v-if="record.valueSource=='script'" compact>
                                      <a-input v-model="record.value" style="width:80%;"/>
                                      <a-button @click="openScriptQuery(text,record)">...</a-button>
                                    </a-input-group>
                                    <a-select v-if="record.valueSource=='constantVar'" v-model="record.value"
                                              :options="constantField"></a-select>
                                </span>
                            </rx-grid>
                        </a-tab-pane>
                        <a-tab-pane :tab="i18n('list.transFerData','传递数据')" key="params" forceRender>
                            <rx-grid ref="params"
                                     :showPage="false"
                                     :columns="webColumns"
                                     :dataSource="webParamsFields"
                                     :bordered="true"
                                     style="height:90%;"
                            >
                                <span slot="valueSource" slot-scope="{text,record,index}">
                                    <a-select v-model="record.valueSource">
                                      <a-select-option value="param">{{ i18n('paraPass', '参数传入') }}</a-select-option>
                                      <a-select-option value="fixedVar">{{ i18n('fixValue', '固定值') }}</a-select-option>
                                      <a-select-option value="script">{{ i18n('form.script', '脚本') }}</a-select-option>
                                      <a-select-option
                                          value="constantVar">{{ i18n('constant', '常量') }}</a-select-option>
                                    </a-select>
                                </span>
                                <span slot="value" slot-scope="{text,record,index}">
                                    <a-input v-if="record.valueSource=='fixedVar'" v-model="record.value"/>
                                    <a-input-group v-if="record.valueSource=='script'" compact>
                                      <a-input v-model="record.value" style="width:80%;"/>
                                      <a-button @click="openScriptQuery(text,record)">...</a-button>
                                    </a-input-group>
                                    <a-select v-if="record.valueSource=='constantVar'" v-model="record.value"
                                              :options="constantField"></a-select>
                                </span>
                            </rx-grid>
                        </a-tab-pane>
                        <a-tab-pane :tab="i18n('list.requestMsg','请求报文')" key="listHtml" forceRender>
                            <rx-monaco-editor
                                v-model="listHtml"
                                language="json"
                                style="height:450px;"
                            >
                            </rx-monaco-editor>
                        </a-tab-pane>
                    </a-tabs>
                </a-tab-pane>
                <a-tab-pane forceRender :tab="i18n('list.PCJSFunc','PC端JS函数')" key="funConf" :closable="false">
                    <rx-fit style="padding-top: 4px;">
                        <div slot="toolheader" foldbtn="false" border="false">
                            <div class="table-operator" style="padding-top: 4px;">
                            </div>
                        </div>
                        <div style="height: 100%;overflow: hidden">
                            <rx-monaco-editor
                                ref="bodyScript"
                                v-model="bodyScript"
                                language="javascript"
                                style="height: 600px "
                                @change="mchange"
                            >
                                <template v-slot:monacoeditor>

                                    <rx-common-script @select="insertScript" use-to="list-pcJs" type="0">
                                        <template v-slot:button>
                                            <a-button type="primary" style="margin-left: 8px">
                                                {{ i18n('list.insertCode', '插入代码') }}
                                                <a-icon type="down"/>
                                            </a-button>
                                        </template>
                                    </rx-common-script>
                                    <rx-common-script-dialog :body="$refs.bodyScript">
                                        <template v-slot:button>
                                            <a-button type="primary" style="margin-left: 8px">
                                                {{ i18n('list.insertScript', '插入脚本') }}
                                                <a-icon type="down"/>
                                            </a-button>
                                        </template>
                                    </rx-common-script-dialog>

                                    <a-select
                                        show-search
                                        :placeholder="i18n('list.selectField', '可选择列表字段')"
                                        option-filter-prop="children"
                                        style="width: 200px;margin-left: 10px"
                                        :filter-option="filterOption"
                                    >
                                        <a-select-option v-for="item of allFields" :value="item.value"
                                                         @click="handInsertField(item)">
                                            {{ item.label }}
                                        </a-select-option>
                                    </a-select>

                                </template>
                            </rx-monaco-editor>
                        </div>
                    </rx-fit>
                </a-tab-pane>
                <a-tab-pane forceRender :tab="i18n('list.cssStyle','CSS样式')" key="cssStyle" :closable="false">
                    <div style="height: 100%;overflow: hidden">
                        <rx-monaco-editor
                            ref="cssEditor"
                            language="css"
                            style="height: 600px "
                            v-model="cssStyle"
                        >
                        </rx-monaco-editor>
                    </div>
                </a-tab-pane>
                <a-tab-pane :tab="i18n('list.importConfig','导入配置')" key="excelConf" forceRender>
                    <a-tabs>
                        <a-tab-pane key="excelConf" :tab="i18n('list.excelTem','EXCEL模板配置')">
                            <rx-fit style="padding-top: 10px;">
                                <div slot="toolheader" foldbtn="false" border="false">
                                    <a-form-item style="display:none">
                                        <a-input v-decorator="['id']"/>
                                        <a-input v-decorator="['isDialog']"/>
                                    </a-form-item>

                                    <div class="table-operator">
                                        <a-button size="small" @click="reloadColumnsExcel">
                                            {{ i18n('list.reloadExcel', '重新加载Excel列头') }}
                                        </a-button>
                                        <a-button size="small" @click="removeRow">{{ i18n('list.deleteLine', '删除行') }}
                                        </a-button>
                                        <a-button size="small" @click="upRow">{{ i18n('list.upward', '向上') }}</a-button>
                                        <a-button size="small" @click="downRow">{{ i18n('list.down', '向下') }}</a-button>
                                        <span style="padding-left: 10px">
                                            <a-checkbox v-model="excelConfJson.specialSn" @change="changeSpecialSn">{{i18n('importConfig.specialSn','指定序号')}}
                                                <a-tooltip placement="top">
                                                    <template slot="title">
                                                        <ul>
                                                            <li>1.{{i18n('importConfig.tip1','列序号从0开始')}}</li>
                                                            <li>2.{{i18n('importConfig.tip2','如果不指定,那么EXCEL的列和配置需要顺序保持一致')}}</li>
                                                            <li>3.{{i18n('importConfig.tip3','否则,那么EXCEL的列号匹配字段名,顺序可以不一致')}}</li>
                                                        </ul>
                                                    </template>
                                                    <a-icon type="question-circle"/>
                                                </a-tooltip>
                                            </a-checkbox>

                                            {{i18n('importConfig.tip4','从第')}}<a-input-number id="inputNumber" size="small"
                                                              v-model="excelConfJson.beginRow" :min="0" :max="100"
                                                              style="width: 50px !important;"/> {{i18n('importConfig.tip5','行开始读取数据')}}
                                            <a-tooltip placement="top">
                                                <template slot="title">
                                                    <span> {{i18n('importConfig.tip6','行序号从0开始,默认模板的话从第二行开始是数据!')}}</span>
                                                </template>
                                                <a-icon type="question-circle"/>
                                            </a-tooltip>
                                        </span>
                                    </div>
                                </div>


                                <rx-grid ref="table_excelConf"
                                         :dataSource="excelConfJson.headerColumnsExcel"
                                         :allowRowSelect="true"
                                         :multiSelect="true"
                                         :showPage="false"
                                         :bordered="true"
                                         :columns="importColumnsExcel"
                                >
                                    <span slot="snTitle">
                                        {{i18n('importConfig.tip7','列序号')}}
                                        <a-tooltip placement="top">
                                           <template slot="title">
                                               <span>{{i18n('importConfig.tip8','列序号指的是EXCEL数据的列号,列号从0开始')}}</span>
                                           </template>
                                           <a-icon type="question-circle"/>
                                       </a-tooltip>

                                    </span>
                                    <span slot="sn" slot-scope="{text,record,index}">
                                      <a-input v-model="record.sn"/>
                                    </span>
                                    <span slot="header" slot-scope="{text,record,index}">
                                      <a-input v-model="record.header"/>
                                    </span>
                                    <span slot="field" slot-scope="{text,record,index}">
                                        {{ record.field }}
                                    </span>
                                    <span slot="selectConfig" slot-scope="{text,record,index}">
                                        <a-button size="small" v-if="record.field"
                                                  @click="openSelectConfig(record)">{{
                                                i18n('list.config', '配置')
                                            }}</a-button>
                                        <span v-if="record.isSelectConfig" class="is-seted"><i
                                            class="iconfont iconsuccess_fill is-seted"></i>{{
                                                i18n('configured', '已配')
                                            }}</span>
                                        <a-icon v-if="record.isSelectConfig" type="delete" style="margin-left: 10px;"
                                                @click="clearSelectConfig(record)"/>
                                    </span>
                                </rx-grid>
                            </rx-fit>
                        </a-tab-pane>
                        <a-tab-pane :tab="i18n('list.scriptConfig','脚本配置')" key="script" forceRender>

                            <div>
                                <div style="display:flex;align-items:center;padding-top:10px;">
                                    <div class="headerText" style="margin-right:10px;margin-left:20px;">
                                        {{ i18n('insertProcess', '插入前处理器') }}:
                                        <a-tooltip>
                                            <template slot="title">
                                                <p>{{ i18n('beforeImport', '插入前处理器，在表单数据导入之前执行。') }}</p>
                                                <p>{{ i18n('needImple', '需要实现接口') }}:</p>
                                                <p>{{ ImportDataHandler }}</p>
                                                <p>{{ i18n('interMethod', '接口方法') }}：</p>
                                                <p>{{ i18n('judgeEachRow', '对每一行进行判断处理') }}</p>
                                                <p>JsonResult handRow(Map&lt;String,Object> data);</p>
                                                <p>{{ i18n('processData', '对读取的数据进行处理') }}</p>
                                                <p>JsonResult beforeInsert(Map&lt;String,Object> data)</p>
                                                <p>
                                                    {{
                                                        i18n('configSpringId', '这里需要配置接口实现类的spring实例Id，这个需要在spring容器进行配置。')
                                                    }}</p>
                                            </template>
                                            <a-icon type="question-circle"/>
                                        </a-tooltip>

                                    </div>
                                    <div style="padding-top:6px;">

                                        <a-input v-model="excelConfJson.importDataHandlerName" disabled>
                                            <a-icon slot="addonAfter" type="close" @click="removeHandler()"
                                                    style="margin-right:10px;"/>
                                            <a-icon slot="addonAfter" type="setting" @click="opens()"/>
                                        </a-input>

                                    </div>
                                </div>
                                <div>

                                    <div style="margin-left: 20px;line-height: 50px;color: #555;font-size: 15px;">
                                        JAVA{{ i18n('form.script', '脚本') }}
                                        <a-checkbox :checked="excelConfJson.customImport"
                                                    @change="changeCustomImport">{{ i18n('customImport', '用户自处理导入') }}</a-checkbox>
                                    </div>
                                    <div style="height:350px;overflow: hidden;padding-right: 20px;margin-left: 20px;">
                                        <rx-monaco-editor ref="javaCode"
                                                          v-model="excelConfJson.javaCode"
                                                          language="java">
                                            <template v-slot:monacoeditor>
                                                <rx-common-script @select="insertConst" use-to="formBoListExcel"
                                                                  type="1">
                                                    <template v-slot:button>
                                                        <a-button type="primary" style="margin-left: 8px">
                                                            {{ i18n('list.insertScript', '插入代码') }}
                                                            <a-icon type="down"/>
                                                        </a-button>
                                                    </template>
                                                </rx-common-script>
                                                <span style="padding-left: 5px;">
                                                    <a-button icon="edit"
                                                              @click="showScriptDialog()">{{
                                                            i18n('list.fastScript', '快速脚本')
                                                        }}</a-button>
                                                </span>
                                                <span style="padding-left: 5px;">
                                                    <a-button
                                                        @click="selectDataSource">{{
                                                            i18n('list.insertSource', '插入数据源')
                                                        }}</a-button>
                                                </span>
                                                <span style="padding-left: 5px;">
                                                    <rx-constant-field @select="insertConst"></rx-constant-field>
                                                </span>

                                                <a-select
                                                    show-search
                                                    :placeholder="i18n('list.selectField', '可选择列表字段')"
                                                    option-filter-prop="children"
                                                    style="width: 200px;margin-left: 10px"

                                                >
                                                    <a-select-option v-for="item of allFields" :value="item.value"
                                                                     @click="insertConst(item.value)">
                                                        {{ item.label }}
                                                    </a-select-option>
                                                </a-select>
                                            </template>


                                        </rx-monaco-editor>
                                    </div>


                                </div>
                            </div>


                        </a-tab-pane>


                    </a-tabs>
                </a-tab-pane>
                <a-tab-pane :tab="i18n('list.exportConfig','导出配置')" key="excelExportConf" forceRender>
                    <rx-fit style="padding-top: 8px;">
                        <div slot="toolheader" foldbtn="false" border="false">
                            <div class="table-operator">
                                <a-button size="small" @click="addExcelExportRow">{{ i18n('list.add', '新增') }}
                                </a-button>
                                <a-button size="small" @click="removeRow">{{ $ti18('rxList.delBtn', '删除') }}</a-button>
                            </div>
                        </div>
                        <rx-grid
                            ref="table_excelExportConf"
                            :dataSource="excelExportFields"
                            :columns="excelExportColumns"
                            :allowRowSelect="true"
                            :multiSelect="true"
                            :showPage="false"
                            :bordered="true"
                            id-field="id"
                        >
                            <span slot="name" slot-scope="{text,record,index}">
                              <a-input v-model="record.name"/>
                            </span>
                            <span slot="setting" slot-scope="{text,record,index}">
                                <a-button size="small"
                                          @click="configExcelExport(record)">{{ i18n('list.config', '配置') }}</a-button>
                                <span v-if="(record.setting && record.setting!='[]') || record.isSetedBtn"
                                      class="is-seted"><i
                                    class="iconfont iconsuccess_fill is-seted"></i>{{ i18n('configured', '已配') }}</span>
                            </span>
                            <span slot="permission" slot-scope="{text,record,index,blur}"
                                  @click="editRecord(record,index,'permission')">
                                {{ text.label }}
                            </span>
                        </rx-grid>
                    </rx-fit>
                </a-tab-pane>
                <a-tab-pane forceRender :tab="i18n('list.permissionConfig','权限配置')" key="permissionConf" :closable="false">
                  <form-bo-list-edit-permission-conf ref="table_permissionConf" :boListId="pkId" :curAppObj="curAppObj" />
                </a-tab-pane>
            </a-tabs>
        </a-form>
        <form-boList-edit-mobile ref="mobile" v-show="activeIdx" :pkId="pkId" :layerid="layerid"
                                 :destroy="destroy"></form-boList-edit-mobile>

        <a-modal :title="i18n2('engLetters','必须为英文字母组合，如abcAction')" v-model="showScript"
                 :ok-text="$ti18('rxForm.ackBtn','确认')" :cancel-text="$ti18('rxForm.cancelBtn','取消')"
                 @ok="handScriptBtn()">
            <a-input v-model="scriptMethod"></a-input>
        </a-modal>
    </div>
</template>
<script>
import FormBoListApi from '@/api/form/core/formBoList'
import {
    BaseForm,
    RxLayout,
    RxGrid,
    RxMonacoEditor,
    RxCommonScript,
    RxCommonScriptDialog,
    RxSelect,
    Dialog,
    Util,
    RxInputI18n,
    RxPopover,
    JsConstant
} from "@lowcode/jpaas-common-lib"
import FormBoListEdit2 from '@/api/form/core/formBoListEdit2'
import FormBoListExpandRow from "./FormBoListExpandRow";
import importDataHandlerDialog from "./importDataHandlerDialog.vue";
import ButtonScript from "@/views/modules/form/core/formPermission/ButtonScript";
import FormBoListButtonPreConfig from "@/views/modules/form/core/FormBoListButtonPreConfig";
import FormBoListEditDataConf from "./FormBoListEditDataConf";
import FormBoListEditPermissionConf from "./FormBoListEditPermissionConf";
import FormBoListEditSearchView from "./FormBoListEditSearchView";
import FormBoListEditMobile from "./FormBoListEditMobile";
import rxInputIcon from '@/components/rxComponent/rx-input-icon';
import {scriptLib, defaultJavaCode} from '@/api/form/core/scriptLib';
import FormBoListBtnServerScript from "@/views/modules/form/core/FormBoListBtnServerScript.vue";
import md5 from 'js-md5'
import CalcRow from "@/views/modules/form/core/FormBoListEditSlots/CalcRow.vue";

export default {
    name: 'FormBoListEdit2',
    props: ["activeIndex", "curAppObj","parentVm"],
    mixins: [BaseForm, FormBoListEdit2],
    components: {
        RxLayout,
        RxGrid,
        RxMonacoEditor,
        RxSelect,
        FormBoListExpandRow,
        FormBoListEditDataConf,
        FormBoListEditPermissionConf,
        FormBoListEditSearchView,
        FormBoListEditMobile,
        rxInputIcon,
        RxInputI18n,
        RxPopover,
        Dialog,
        RxCommonScript,
        RxCommonScriptDialog,
        CalcRow
    },
    data() {
        return {
            activeIdx: this.activeIndex,
            showSearchStyle: 'NO',
            showSearchLayout: 'YES',
            isShowSearch: true,
            formId: "",
            formName: "",
            boDefId: "",
            bodyScript: "",
            cssStyle: "",
            curRecord: {},
            isFieldShow: true,

            errorMsg: '',

            defaultJavaCode: defaultJavaCode,
            scriptLib: scriptLib,
            //配置的md5
            configMd5: '',
            //监测数据是否发生改变
            isChange: false,
            //搜索条件隐藏最多显示个数
            searchMax: 4,
            labelCol: {span: 8},
            wrapperCol: {span: 16},
            buttonMax: 4,

            excelConfJson: {
                importDataHandler: '',
                importDataHandlerName: '',
                //默认从第一行读取
                beginRow: 2,
                javaCode: '',
                headerColumnsExcel: [],
                specialSn: false,
                //自定义导入
                customImport:false
            },
            ImportDataHandler: JsConstant.ImportDataHandler,
            //默认的标准字段
            standardFields:[
            'ID_', 'TENANT_ID_', 'CREATE_BY_','UPDATE_BY_',
            'CREATE_TIME_','UPDATE_TIME_','CREATE_DEP_ID_',
            'REF_ID_','PARENT_ID_','UPDATE_VERSION_',
            'USER_INFO_','COMPANY_ID_','INST_ID_',
            'INST_STATUS_','DELETED_'
            ],
        }
    },
    watch: {
        activeIndex: function (val) {
            this.activeIdx = val;
            if(this.activeKey=='permissionConf'){
              this.initPermissionConf();
            }
        }
    },
    methods: {
        btnChangeNum(value){
            if(value > 10){
                this.$message.warning(this.i18n('list.btnMaxTips','按钮最多展示10个'))
            }
            if(value < 1){
                this.$message.warning(this.i18n('list.btnMinTips','按钮最少显示1个'))
            }
        },
        i18n(name, text, key) {
            return this.$ti18(name, text, "formBoListDialog", key);
        },
        i18nCustomQuery(name, text, key) {
            return this.$ti18(name, text, "formCustomQuery", key);
        },
        //控制显示字段仅可选择一个
        selectDisplay(record){
            if (record.displayField){
                this.returnFields=this.returnFields.map(item=>{
                    if (item.idx_==record.idx_){
                        return item;
                    }
                    item.displayField=false;
                    return item;
                })
            }
        },
        allowSortAllChange(e){
            let checked =e.target.checked;
            if(this.headerFields.length ==0){
                return;
            }
            this.headerFields.forEach(item => {item.allowSort = checked})
        },
        handScriptBtn() {

            let self = this;
            this.scriptRow.btnClick = 'on' + this.scriptMethod;
            this.scriptMethod = '';
            this.showScript = false

            var table = this.$refs["table_" + this.activeKey];
            var conf = {
                component: FormBoListBtnServerScript,
                title: this.i18n2('scriptDef', '按钮服务端响应脚本定义'),
                curVm: this,
                data: {row: this.scriptRow, fieldDatas: this.fieldDatas},
                widthHeight: ['1100px', '550px']
            };
            Util.open(conf, function (action) {

                if (action != 'ok') return;
                var serverHandleScript = this.getData();

                self.scriptRow.config = {serverHandleScript: serverHandleScript};
                self.scriptRow.isSetedBtn = true
                table.$forceUpdate()
            });
        },
        mchange(val) {
            let dom = document.getElementsByClassName('monaco-list-rows')[0];
        },
        get(id) {
            return FormBoListApi.get(id);
        },
        getTable(id) {
            return this.$refs["table_" + id];
        },
        getRerurnFieldByField(fieldKey) {
            if (this.returnFields.length == 0) {
                return {};
            }
            let item = this.returnFields.find(item => {
                if (fieldKey == item.field) {
                    return true;
                }
            });
            return item
        },
        getReturnFields() {
            for (let k = 0; k < this.returnAllFields.length; k++) {
                let oenField = this.returnAllFields[k];
                oenField.isReturn = false;
                let returnField = this.getRerurnFieldByField(oenField.field);
                if (returnField && returnField.field) {
                    oenField.isReturn = true;
                    oenField.displayField=returnField.displayField;
                    oenField.i18nJson = returnField.i18nJson;
                }
            }
            return this.returnAllFields;
        },
        save(values) {
            let configJson = this.handData(values, true)
            //点击保存之后，更新md5
            if (!configJson) {
                return
            }
            if (configJson) {
                let md5 = this.$md5(JSON.stringify(configJson))
                this.configMd5 = md5
            }
            return FormBoListApi.saveConfigJson(configJson);
        },
        positionChange(e) {
            let table = this.getTable(this.activeKey);
            let dataAction = table.getData();
            for (let i = 0; i < dataAction.length; i++) {
                let row = dataAction[i];
                table.updateRow(row, {headerAlign: e.target.value});
            }
        },
        handData(values, show) {
            var expandRowJson = {};
            var leftTreeJson = [];
            var summaryRowJson = [];
            var topBtnsJson = [];
            var dataRightJson = [];
            var fieldJson = [];
            var mappingJson = {};
            var interfaceMappingJson = {};
            var searchJson = [];

            var dataConf = this.getTable("dataConf");
            dataRightJson = dataConf.getData();
            if (dataRightJson.length==0 && values.dataRightJson!=null){
              dataRightJson=JSON.parse(values.dataRightJson)
            }
            if (this.isLeftTree == 'YES') {
                var tabTreeConf = this.getTable("tabTreeConf");
                leftTreeJson = tabTreeConf.getData();
            }

            if (this.isExpandRow == 'YES') {
                var result = this.$refs.expandRow.getData();
                if (!result.success) {
                    this.$message.error(result.message);
                    return new Promise(resolve => {
                        resolve({success: false});
                    })
                }
                expandRowJson = result.data;
            }
            var columnConf = this.getTable("columnConf");
            var columns = columnConf.getData();
            //剔除空行
            var newColumns = [];
            for (var i = 0, j = columns.length; i < j; i++) {
                if (columns[i].header) {
                    newColumns.push(columns[i]);
                }
            }


            var excelExportAry = [];
            var excelExportData = this.getTable("excelExportConf").getData();
            for (var i = 0, j = excelExportData.length; i < j; i++) {
                if (excelExportData[i].name) {
                    excelExportAry.push(excelExportData[i]);
                }
            }

            var searchConf = this.getTable("searchConf");
            searchJson = searchConf.getData();

            var toolBar = this.getTable("toolBar");
            topBtnsJson = toolBar.getData();
            if (values.isDialog == 'YES') {
                var ary = this.getReturnFields();
                for (var i = 0; i < ary.length; i++) {
                    if (!ary[i].visible) {
                        ary[i].visible = false;
                    }
                }
                fieldJson = ary;
            }

            if (this.mdl.useCondSql == 'WEBREQ') {
                mappingJson.headerMapping = JSON.stringify(this.$refs.header.getData());
                mappingJson.paramsMapping = JSON.stringify(this.$refs.params.getData());
                mappingJson.bodyMapping = this.listHtml;
            }
            if (this.mdl.useCondSql == 'INTERFACE') {
                interfaceMappingJson.pathParamsMapping = JSON.stringify(this.$refs.pathParams ? this.$refs.pathParams[0].getData() : []);
                interfaceMappingJson.headersMapping = JSON.stringify(this.$refs.headers ? this.$refs.headers[0].getData() : []);
                interfaceMappingJson.queryMapping = JSON.stringify(this.$refs.query ? this.$refs.query[0].getData() : []);
                interfaceMappingJson.bodyMapping = JSON.stringify(this.$refs.body ? this.$refs.body[0].getData() : []);
            }
            //查询视图配置
            var editSearchViewData = this.$refs.editSearchView.getData();
            var mobileConf = this.$refs.mobile.getData();
            if (!mobileConf.success) {
                this.$message.error(mobileConf.message);
                return new Promise(resolve => {
                    resolve({success: false});
                })
            }

            var configJson = {
                id: values.pkId,
                idField: values.idField,
                textField: values.textField ? values.textField : "",
                parentField: values.parentField ? values.parentField : "",
                parentIdValue: values.parentIdValue ? values.parentIdValue : "",
                buttonMax: this.buttonMax ? this.buttonMax : 4,
                isShowLeft: this.isLeftTree,
                showSummaryRow: this.showSummaryRow,
                isExpandRow: this.isExpandRow,
                isDialog: values.isDialog,
                isSearchHeader: this.showSearchStyle,
                fontPosition: values.fontPosition,
                isSearchLayout: this.showSearchLayout,
                isShowSearch: this.isShowSearch ? "YES" : "NO",
                isFieldShow: this.isFieldShow ? 'YES' : 'NO',
                colsJson: JSON.stringify(newColumns),
                leftTreeJson: JSON.stringify(leftTreeJson),
                summaryConf: JSON.stringify(summaryRowJson),
                statisticsRows: this.showSummaryRow === 'YES'?JSON.stringify(this.statisticsRows):"{}",
                expandRowJson: JSON.stringify(expandRowJson),
                fieldJson: JSON.stringify(fieldJson),
                searchJson: JSON.stringify(searchJson),
                searchMax: this.searchMax,
                topBtnsJson: JSON.stringify(topBtnsJson),
                dataRightJson: JSON.stringify(dataRightJson),
                publishConf: JSON.stringify(values.publishConf),
                bodyScript: this.bodyScript ? this.bodyScript : "",
                cssStyle: this.cssStyle ? this.cssStyle : "",
                webreqMappingJson: JSON.stringify(mappingJson),
                interfaceMappingJson: JSON.stringify(interfaceMappingJson),

                //excel导入配置
                excelConfJson: JSON.stringify(this.excelConfJson),

                excelExport: JSON.stringify(excelExportAry),
                instColumnConfig: JSON.stringify(this.instColumnConfig),
                editSearchViewJson: JSON.stringify(editSearchViewData.editSearchView),
                queryStrategyViewJson: JSON.stringify(editSearchViewData.queryStrategyView),
                groupViewJson: JSON.stringify(editSearchViewData.groupView),
                isSearchView: editSearchViewData.showSearchViewStyle,
                isShowView: editSearchViewData.isShowView,
                listLayout: JSON.stringify(this.listLayout),
                mobileConf: JSON.stringify(mobileConf.data)
            };


            //searchJson
            if (show) {
                for (let i = 0; i < searchJson.length; i++) {
                    if (!searchJson[i].fieldName) {
                        this.$message.error('搜索字段必填');
                        return false;
                    }
                }
            }
            return configJson;
        },
        validMd5Change() {
            var this_ = this;
            this.form.validateFields((err, values) => {
                values.pkId = this_.pkId;
                let configJson = this_.handData(values)
                if (configJson) {
                    //获取当前设置的md5
                    let md5 = this_.$md5(JSON.stringify(configJson))
                    //  比较两个md5
                    if (this_.configMd5 != '' && this_.configMd5 != md5) {
                        this_.isChange = true
                    } else {
                        this_.isChange = false
                    }
                }
            })
        },
        opens() {
            let _self = this;
            Util.open({
                component: importDataHandlerDialog,
                curVm: this,
                widthHeight: ['800px', '600px'],
                title: _self.i18n('selectHandler', '选择表单数据插入前处理器处理器')
            }, function (action, data) {
                if (action != 'ok') {
                    return;
                }
                _self.$set(_self.excelConfJson, 'importDataHandler', data.value)
                _self.$set(_self.excelConfJson, 'importDataHandlerName', data.label)
            });
        },

        removeHandler() {
            this.handlerAttr['importDataHandler'] = "";
            this.handlerAttr['importDataHandlerName'] = "";
        },
        initReturnFields() {
            this.returnFields = [];
            for (let i = 0; i < this.returnAllFields.length; i++) {
                let field = this.returnAllFields[i];
                if (field.isReturn) {
                    this.returnFields.push({
                        header: field.header,
                        field: field.field,
                        i18nJson: field.i18nJson,
                        displayField: field.displayField=="true"?true:false
                    });
                }
            }
        },
        onload_(values) {
            if (values) {
                this.bodyScript = values.bodyScript;
                this.cssStyle = values.cssStyle;
                this.isLeftTree = values.isLeftTree;
                this.showSummaryRow = values.showSummaryRow;
                this.showSearchStyle = values.isSearchHeader || "NO";
                this.searchMax = values.searchMax || this.searchMax;

                this.showSearchLayout = values.isSearchLayout || "YES";
                this.isShowSearch = values.isShowSearch == 'YES' ? true : false;
                this.buttonMax = values.buttonMax || 4;
                this.isFieldShow = values.isFieldShow == 'YES' ? true : false;
                this.isExpandRow = values.isExpandRow;
                if (this.isLeftTree == 'YES' && values.leftTreeJson) {
                    this.leftTreeFields = JSON.parse(values.leftTreeJson);
                }
                if (this.showSummaryRow === 'YES') {
                    let statisticsRows  = values.statisticsRows || '{}' ;
                    let obj = new Function(`return ${statisticsRows}`)()
                    this.statisticsRows = obj;
                    if(values.summaryConf && (!Object.keys(obj).length || (obj.list && obj.list.length === 0))){
                        let summaryConf = JSON.parse(values.summaryConf)
                        if(summaryConf.length){
                            this.isOldCalcData = true
                        }
                    }
                }
                if (values.searchJson) {
                    this.searchFields = this.loadCurrent(JSON.parse(values.searchJson), 'fieldLabel');
                }

                if (values.publishConf) {
                    values.publishConf = JSON.parse(values.publishConf);
                } else {
                    values.publishConf = [];
                }
                if (values.rowEdit == 'NO') {
                    this.getTable("columnConf").initColumns(this.headerColumns.filter(item => {
                        return item.dataIndex != 'control';
                    }).map(item => {
                        return item.dataIndex
                    }));
                }
                if (values.isDialog != 'YES') {
                    this.initBtns(values);
                }
                //机构个性化配置
                if (values.instColumnConfig) {
                    this.instColumnConfig = JSON.parse(values.instColumnConfig);
                }

                this.handReturnColumns(values);
                //this.handleHeaderColumns(values);
            }
            var self = this;
            FormBoListApi.getEdit2(this.pkId).then(data => {
                if (data.errorMsg) {
                    self.errorMsg = data.errorMsg;
                    return;
                }
                self.formId = data.formId;
                self.formName = data.formName;
                self.boDefId = data.boDefId;
                console.log('data',data.fieldColumns)
                self.fieldDatas = data.fieldColumns.map(field => {
                    return {label: field.header, value: field.field, key: field.dataType}
                });
                if (self.isExpandRow === 'YES' && values.expandRowJson) {
                    self.expandRowFields = JSON.parse(values.expandRowJson);
                    self.$refs.expandRow.setData(self.expandRowFields, self.fieldDatas);
                }
                if (values.listLayout) {
                    let json = JSON.parse(values.listLayout);
                    for(let key in json){
                      let obj = self.listLayout[key];
                      if(obj) {
                        json[key].name = obj.name;
                      }
                    }
                    self.listLayout = json;
                }
                self.$refs.editSearchView.setData({
                    isShowView: values.isShowView,
                    showSearchViewStyle: values.isSearchView,
                    editSearchView: JSON.parse(data.editSearchViewJson || "[]"),
                    queryStrategyView: JSON.parse(data.queryStrategyViewJson || "[]"),
                    groupView: JSON.parse(data.groupViewJson || "[]")
                });
                self.$refs.mobile.setData(self, values.mobileConf);
                if (values.topBtnsJson) {
                    self.toolBarFields = self.loadCurrent(JSON.parse(values.topBtnsJson), 'btnLabel');
                }
                if (values.isDialog === 'YES') {
                    self.returnAllFields = data.fieldColumns;
                    self.initReturnFields();
                }

                /*这段代码兼容老数据，新项目可以不用start*/
                data.headerColumns.forEach(item=>{
                    if(!item.hasOwnProperty('rowMerge')){
                        item.rowMerge = false
                    }
                })
                /*这段代码兼容老数据，新项目可以不用end*/
                self.headerFields = self.loadCurrent(data.headerColumns, 'header');
                if (data.excelConfJson) {
                    self.excelConfJson = data.excelConfJson;
                }


                self.excelExportFields = data.excelExport.map(item => {
                    let permission = item.permission || "{\"label\":\"所有人\",\"value\":\"everyone\"}";
                    delete item.permission;
                    return {...item, permission: JSON.parse(permission)};
                })
                if (values.useCondSql == 'WEBREQ') {
                    self.webHeaderFields = self.parseMapping(data.headerMapping);
                    self.webParamsFields = self.parseMapping(data.paramsMapping);
                    self.listHtml = data.bodyMapping;
                    self.loadConstants();
                }
                if (values.useCondSql == 'INTERFACE') {
                    if (data.pathParamsMapping && data.pathParamsMapping.length > 0) {
                        self.interfaceFields.push({
                            'key': 'pathParams',
                            'title': self.i18n('list.reqPathPara', '请求路径参数'),
                            'fields': self.parseMapping(data.pathParamsMapping)
                        });
                    }
                    if (data.headersMapping && data.headersMapping.length > 0) {
                        self.interfaceFields.push({
                            'key': 'headers',
                            'title': self.i18n('list.reqHeadPara', '请求头参数'),
                            'fields': self.parseMapping(data.headersMapping)
                        });
                    }
                    if (data.queryMapping && data.queryMapping.length > 0) {
                        self.interfaceFields.push({
                            'key': 'query',
                            'title': self.i18n('list.reqPara', '请求参数'),
                            'fields': self.parseMapping(data.queryMapping)
                        });
                    }
                    if (data.bodyMapping && data.bodyMapping.length > 0) {
                        self.parseChildMapping(data.bodyMapping, "0");
                        self.interfaceFields.push({
                            'key': 'body',
                            'title': self.i18n('list.reqBodyPara', '请求体参数'),
                            'fields': self.parseMapping(data.bodyMapping)
                        });
                    }
                    if (self.interfaceFields.length > 0) {
                        self.interfaceActiveKey = self.interfaceFields[0].key;
                    }
                    self.loadConstants();
                }
                self.$nextTick(function () {
                    let configJson = self.handData(values)
                    if (configJson) {
                        let md5 = self.$md5(JSON.stringify(configJson))
                        self.tempJson = configJson;
                        self.configMd5 = md5;
                        console.log(self.configMd5)
                    }

                })

            })
        },
        //当不分页或者时单选的时候，不显示选择列。
        handReturnColumns(values) {
            if (values.multiSelect == 'NO' || values.isPage == 'NO') {
                this.returnColumns.splice(2, 1);
            }
        },
        //当不是列表时，删除过滤配置
        handleHeaderColumns(values) {
            if (values.isDialog == 'YES') {
                this.headerColumns.splice(10, 1);
            }
        },
        parseChildMapping(children, parentId) {
            if (!children) {
                return;
            }
            for (var i = 0; i < children.length; i++) {
                let child = children[i];
                child.parentId = parentId;
                this.parseChildMapping(child.children, child.idx_);
            }
        },
        parseMapping(mapping) {
            return mapping.map(item => {
                if (item.children) {
                    item.children = this.parseMapping(item.children);
                }
                return {valueSource: '', value: '', ...item};
            });
        },
        validForm(values) {
            var arr = [];
            var toolBar = this.getTable("toolBar");
            if (toolBar) {
                var topBtnsJson = toolBar.getData();
                for (var i = 0; i < topBtnsJson.length; i++) {
                    if (arr.includes(topBtnsJson[i].btnName)) {
                        this.activeKey = "toolBar";
                        this.$message.error(this.i18n('notSetSame', '不可设置同标识按钮！'));
                        return false;
                    }
                    arr.push(topBtnsJson[i].btnName);
                }
            }
            return true;
        },
        handleSubmit(self, this_, callback) {
            this_.form.validateFields((err, values) => {
                if (err) {
                    this_.activeKey = "columnConf";
                    return;
                }
                values.pkId = this_.pkId;
                this_.confirmLoading = true;
                if (this_.validForm) {
                    var flag = this_.validForm(values);
                    if (!flag) {
                        return;
                    }
                }
                this_.save(values).then(res => {
                    if (res.success && res.code == 200) {
                        if (callback) {
                            callback();
                        }
                    }
                }).catch(() => {
                    this_.$message.error(self.$ti18('rxMsa.sysError', '系统错误，请稍后再试!'))
                }).finally(() => {
                    this_.confirmLoading = false
                })
            })
        },
        //获取自定义查询返回字段
        getResultField(ary) {
            var str = "{";
            for (var i = 0; ary && i < ary.length; i++) {
                if (i > 0) {
                    str += ",";
                }
                var obj = ary[i];
                str += obj.fieldName;
            }
            str += "}";
            return str;
        },
        //获取自定义查询条件字段
        getWhereField(ary) {
            var tmp = {};
            var strTmp = " * @param ";
            for (var i = 0; ary && i < ary.length; i++) {
                var obj = ary[i];
                var paramType = obj.columnType;
                strTmp += obj.fieldName + " " + paramType + "\n";
                tmp[obj.fieldName] = "";
            }
            return {
                tmp: tmp,
                strTmp: strTmp
            };
        },
        fieldFocus(record) {
            this.curRecord = record;
        },
        filterOption(input, option) {
            this.curRecord["searchField"] = {key: input, change: true};
            return (
                option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
            );
        },
        openPreCondSetting(record) {
            var config = {
                curVm: this,
                max: true,
                component: FormBoListButtonPreConfig,
                data: {
                    config: record.btnPreCond, pkId: this.pkId
                },
                zIndex: 999,
                title: this.i18n('list.preConfig', '按钮前置条件配置')
            };
            Util.open(config, function (action, data) {
                if (action == "ok" && data) {
                    record.btnPreCond = data;
                    record.isSetedPreCondition = true
                }
            });
        },
        selectBoNode(selKeys, e) {
            let node = e.node.dataRef;
            let isField = node.isField;

            if (!isField) {
                return;
            }
            let parentNode = e.node.$parent.dataRef;
            this.insertJavaCode(parentNode.name + "." + node.key);

        },
        openShowSetting(record) {
            if (!record.btnShow) {
                record.btnShow = "";
            }
            var config = {
                curVm: this,
                max: true,
                component: ButtonScript,
                data: {
                    pkId: this.pkId,
                    script: record.btnShow
                },
                zIndex: 9999,
                title: this.i18n('list.displayConfig', '按钮显示条件配置')
            };
            Util.open(config, function (action, data) {
                if (action == "ok") {
                    record.btnShow = data;
                    record.isSetedShowCondition = true
                }

            });
        },
        changeSpecialSn(e) {
            this.excelConfJson.specialSn = e.target.checked;
        },
        insertConst(val) {
            this.$refs.javaCode.insertContent(val);
        },
        changeCustomImport(e){
            this.$set(this.excelConfJson,"customImport",e.target.checked);
        },
        rowMergeChange(e,record){
            debugger
            record.rowMerge = e.target.checked;
        }
    }
}
</script>
<style scoped>
.returnFieldBtn {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.tableToolBar {
    padding-right: 0px;
}

.FormBoListEdit2 >>> .noOverflow {
    overflow: initial;
}

.ant-form-inline .ant-form-item {
    display: flex;
}

.table-page-search-wrapper .ant-form-inline .ant-form-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 12px;
    margin-right: 0;
}

.table-page-search-wrapper .ant-form-inline .ant-form-item .ant-form-item-control-wrapper {
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    display: inline-block;
    vertical-align: middle;
}

.table-operator2 {
    padding-bottom: 10px;
}

.table-operator2 > button {
    margin-top: 6px;
}

.table-operator2 > button,
.table-operator > button {
    margin-right: 6px;
}

.tabBox >>> .ant-tabs-bar {
    margin-bottom: 0px;
}

.tabBox >>> .ant-tabs-bar .ant-tabs-tab {
    padding: 0px 5px 8px;
    margin-right: 20px;
}

.tabNavNameGroup {
    display: flex !important;
}

.tabNavNameInput {
    flex: 1 !important;
}

.table_toolBar >>> .ant-table-row-indent,
.table_toolBar >>> .ant-table-row-expand-icon {
    float: left;
    margin-top: 2px;
}

.table_toolBar >>> .editable-cell {
    overflow: hidden;
}

.is-seted {
    color: #70B90B;
    margin-left: 5px;
}
.button-set{
    border-color: #7bc616;
    color: #7bc616;
}
.table-page-search-wrapper>>>.ant-form-item-with-help{
    margin-bottom: 0px!important;
}
.list-design-search-header{
    display: flex;
    gap: 20px;
}
</style>
